// 放置全局指令
// console.log('自定义指令代码');
// 封装按钮权限控制的自定义指令
// Vue.directive('自定义指令名称', { 
//   bind(el, binding){
//     // 组件初始化过程，会执行一次
//   },
//   update(el, binding){
//     // 自定义指令后面绑定的数据发生变化时，会执行
//   },
//   inserted(el, binding){
//     // 组件初始化过程，dom被插入到页面中时，会执行一次
//     // 在这里能拿到绑定了该自定义指令的dom元素的父元素
//     // el：绑定定了该指令的dom元素
//     // binding：是一个对象，里面记录了自定义指令相关的信息
//     // binding.value：自定义指令等于号后面的值
//   } 
// })
import Vue from 'vue'
import store from '@/store'

Vue.directive('access', {
  inserted(el, binding) {
    // console.log('el', el);
    // console.log('binding', binding);
    // 按钮权限控制逻辑
    // binding.value：按钮的权限码值
    // store.state.user.userInfo.roles.points：员工的按钮权限数据
    if (!store.state.user.userInfo.roles.points.includes(binding.value)) {
      // 按钮权限码值不在员工的按钮权限数据中
      // 隐藏该按钮
      // el.style.display = 'none' // 使用样式隐藏按钮（不好）
      el.parentNode.removeChild(el) // 将按钮从dom树中去除（好）
    }
  }
})
